<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>HOME</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<!--标准mui.css-->
		<link rel="stylesheet" href="../css/mui.min.css">
		<!--App自定义的css-->
		<link rel="stylesheet" type="text/css" href="../css/app.css" />
		<link rel="stylesheet" type="text/css" href="../css/swiper.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/qpad.css" />
	</head>

	<body>
		<div class="swiper-container">
			<div class="swiper-wrapper">
				<div class="swiper-slide"></div>
				<div class="swiper-slide"></div>
				<div class="swiper-slide"></div>
				<div class="swiper-slide"></div>
				<div class="swiper-slide"></div>
				<div class="swiper-slide"></div>
				<div class="swiper-slide"></div>
				<div class="swiper-slide"></div>
				<div class="swiper-slide"></div>
				<div class="swiper-slide"></div>
			</div>
		</div>
	</body>
	<script type="text/html" id="qitem">
		<ul class="mui-table-view">
			<input type="hidden" class="qid" value="{{id}}" />
			<li class="mui-table-view-cell" style="background-color: #f8f8fa;">
				<span class="mui-pull-left">
					<button class="mui-btn mui-btn-primary">
						{{if type=="single_choice"}}单选{{/if}}
						{{if type=="uncertain_choice"}}多选{{/if}}
						{{if type=="determine"}}判断{{/if}}
						{{if type=="material"}}材料题{{/if}}
					</button>
				</span>
				<span class="mui-pull-left  mui-ellipsis" style="margin-left: 20px;line-height: 33px;width: 50%;font-size: 15px;">
					{{pageParam("testTitle")}}
				</span>
				<span class="mui-pull-right" style="margin-right: 10px;line-height: 33px;font-size: 15px;"><span style="color: #2fa4ea;">{{pageParam("pageno")}}</span>/{{pageParam("totalpage")}}</span>
			</li>
			<li class="mui-table-view-cell selectitems" id="{{id}}" data-type="{{type}}">
				<h5 style="font-size: 18px;line-height: 24px;">{{#loadImage(stem)}}</h5> {{if type == "determine"}}
				<h4 class="choiceitem" data-type="{{type}}" onclick="selectAnswer(1,{{id}},{{answer}},this)">
								<span class="selectitem{{if myans}}{{each $toArray(myans)}}{{if $value == 1}} onrightitem selected{{else}} rightitem{{/if}}{{/each}}{{else}} rightitem{{/if}}">	
								</span>
								<span class="answeritem">
									正确
								</span>						
				</h4>
				<div class="clearfix">

				</div>
				<h4 class="choiceitem" data-type="{{type}}" onclick="selectAnswer(0,{{id}},{{answer}},this)">
								<span class="selectitem{{if myans}}{{each $toArray(myans)}}{{if $value == 0}} onwrongitem selected{{else}} wrongitem{{/if}}{{/each}}{{else}} wrongitem{{/if}}">	
								</span>
								<span class="answeritem">
									错误
								</span>						
				</h4> {{else if type == "material"}} {{else}} {{each $parse(metas).choices as value i}}
				<h4 class="choiceitem" data-type="{{type}}" onclick="selectAnswer({{i}},{{id}},{{answer}},this)">
								<span class="selectitem">
									{{if i==0}}A{{/if}}
									{{if i==1}}B{{/if}}
									{{if i==2}}C{{/if}}
									{{if i==3}}D{{/if}}
									{{if i==4}}E{{/if}}
									{{if i==5}}F{{/if}}
								</span>
								<span class="answeritem">
									{{#value}}
								</span>						
					</h4> {{/each}} {{/if}}
			</li>

			{{if sub}} {{each sub as vv}} {{if vv}}
			<li class="mui-table-view-cell selectitems" id="{{vv.id}}" data-type="{{vv.type}}">
				<h5 style="font-size: 18px;line-height: 24px;">({{if vv.type=="single_choice"}}单选{{/if}}{{if vv.type=="uncertain_choice"}}多选{{/if}}{{if vv.type=="determine"}}判断{{/if}})&nbsp;{{#vv.stem}}</h5> {{if vv.type == "determine"}}
				<h4 class="choiceitem" data-type="{{vv.type}}" onclick="selectAnswer(1,{{vv.id}},{{answer}},this)">
								<span class="selectitem rightitem">	
								</span>
								<span class="answeritem">
									正确
								</span>						
				</h4>
				<div class="clearfix">

				</div>
				<h4 class="choiceitem" data-type="{{vv.type}}" onclick="selectAnswer(0,{{vv.id}},{{answer}},this)">
								<span class="selectitem wrongitem">	
								</span>
								<span class="answeritem">
									错误
								</span>						
				</h4> {{else}} {{each $parse(vv.metas).choices as value i}}
				<h4 class="choiceitem" data-type="{{vv.type}}" onclick="selectAnswer({{i}},{{vv.id}},{{answer}},this)">
									<span class="selectitem">
										{{if i==0}}A{{/if}}
										{{if i==1}}B{{/if}}
										{{if i==2}}C{{/if}}
										{{if i==3}}D{{/if}}
										{{if i==4}}E{{/if}}
										{{if i==5}}F{{/if}}
									</span>
									<span class="answeritem">
										{{#value}}
									</span>						
						</h4> {{/each}} {{/if}}
			</li>
			{{/if}} {{/each}} {{/if}}
			<li class="mui-table-view-cell jiexiArea" style="height: 300px;">
				<div style="background-color: #f8f8fa;padding: 10px 10px;">
					<h4 class="jiexi-title"><img src="../image/xiangjie.png" style="height: 25px;"/></h4>
					<div class="jiexi">
					</div>
				</div>
			</li>
		</ul>
	</script>
	<script src="../script/mui.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../script/swiper.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../script/template.js" type="text/javascript" charset="utf-8"></script>
	<script src="../script/template/helper.js" type="text/javascript" charset="utf-8"></script>
	<script src="../script/app.js" type="text/javascript" charset="utf-8"></script>
	<script src="../script/db.js" type="text/javascript" charset="utf-8"></script>
	<script src="../script/myswiper.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		MYPAGE = {};
		MYPAGE.pageno = 0;
		MYPAGE.answerdata = {};

		function checkAnswer(ans, answer, j) {
			j = parseInt(j)
			MYPAGE.data[j] = ans;
			//			alert(JSON.stringify(MYPAGE.data));
			//			localStorage.setItem('answer'+MYPAGE.testid,JSON.stringify(MYPAGE.data));
		}

		function selectAnswer(k, j, answer, obj) {
			var ans = Array();
			var type = obj.getAttribute('data-type');
			var items = obj.parentNode.getElementsByClassName('selectitem');
			var citem = obj.getElementsByClassName("selectitem")[0];
			if (type == "uncertain_choice") {
				var cClassName = citem.className;
				switch (cClassName) {
					case "selectitem":
						citem.className = "selectitem selected";
						for (var i = 0; i < items.length; i++) {
							if (items[i].className == "selectitem selected") {
								var index = ans.length;
								ans[index] = i;
							}
						}
						checkAnswer(ans, answer, j);
						break;
					case "selectitem selected":
						citem.className = "selectitem";
						for (var i = 0; i < items.length; i++) {
							if (items[i].className == "selectitem selected") {
								var index = ans.length;
								ans[index] = i;
							}
						}
						checkAnswer(ans, answer, j);
						break;
					default:
						citem.className = "selectitem";
						for (var i = 0; i < items.length; i++) {
							if (items[i].className == "selectitem selected") {
								var index = ans.length;
								ans[index] = i;
							}
						}
						checkAnswer(ans, answer, j);
						break;
				}
			} else if (type == "single_choice") {
				var cClassName = citem.className;
				switch (cClassName) {
					case "selectitem":
						for (var i = 0; i < items.length; i++) {
							items[i].className = "selectitem";
						}
						citem.className = "selectitem selected";
						ans[0] = k;
						checkAnswer(ans, answer, j);
						break;
					case "selectitem selected":
						citem.className = "selectitem";
						ans[0] = k;
						checkAnswer(ans, answer, j);
					default:
						citem.className = "selectitem";
						ans[0] = k;
						checkAnswer(ans, answer, j);
						break;
				}
			} else if (type == "determine") {
				var cClassName = citem.className;
				switch (cClassName) {
					case "selectitem rightitem":
						items[1].className = "selectitem wrongitem";
						citem.className = "selectitem onrightitem selected";
						ans[0] = k;
						checkAnswer(ans, answer, j);
						break;
					case "selectitem wrongitem":
						items[0].className = "selectitem rightitem";
						citem.className = "selectitem onwrongitem selected";
						ans[0] = k;
						checkAnswer(ans, answer, j);
						break;
					case "selectitem onrightitem selected":
						citem.className = "selectitem rightitem";
						ans[0] = k;
						checkAnswer(ans, answer, j);
						break;
					case "selectitem onwrongitem selected":
						citem.className = "selectitem wrongitem";
						ans[0] = k;
						checkAnswer(ans, answer, j);
						break;
				}
			}
			//		.className="selectitem selected";
		};


		function submitAnswer() {
			api.confirm({
				title: '交卷',
				msg: '答题完毕，是否交卷?',
				buttons: ['确定', '取消']
			}, function(ret, err) {
				if (ret.buttonIndex == 1) {
					var key = getUserKey();
					if (key) {
						var sdata = {
							key: key,
							data: MYPAGE.data,
							testid: MYPAGE.testid
						}
						var url = MYAPP.webroot + "/api/index.php/Home/Index/finishTestPaper";
						api.ajax({
							url: url,
							method: 'post',
							timeout: 30,
							dataType: 'json',
							data: {
								values: sdata
							},
							returnAll: false
						}, function(ret, err) {
							if (ret.code = 200) {
								if (ret.status == "ok") {
									api.alert({
										title: '查看结果',
										msg: '答案已提交完毕，点击确定查看考试结果。',
										buttons: ['确定']
									}, function(ret, err) {
										if (ret.buttonIndex == 1) {
											var data = {
												id: MYPAGE.testid
											}
											api.openWin({
												name: 'result',
												url: 'result.html',
												pageParam: data
											});
										}
									});
								}
							} else {
								api.toast({
									msg: '错误码：' + err.code + '；错误信息：' + err.msg + '网络状态码：' + err.statusCode,
									location: 'middle',
									duration: 1000
								});
							}
						});
					} else {
						login();
					}
				}
			});
		}
		apiready = function() {
			var data = api.pageParam;
			MYPAGE.testid = data.id;
			MYPAGE.testTitle = data.title;
			var myanswer = localStorage.getItem('answer' + MYPAGE.testid);
			if (myanswer) {
				MYPAGE.data = JSON.parse(myanswer);
			} else {
				MYPAGE.data = {};
			}
			//			var timer = localStorage.setItem('timer' + MYPAGE.testid);
			//			
			//			if (timer) {
			//				MYPAGE.timer = timer;
			//			} else {
			//				MYPAGE.timer = data.timer;
			//			}
			showWaiting("稍等一下哦!");
			var url = MYAPP.webroot + "/api/index.php/Home/Index/doTestpaper/testid/" + data.id;
			api.ajax({
				url: url,
				method: 'post',
				timeout: 30,
				dataType: 'json',
				data: {
					values: data
				},
				returnAll: false
			}, function(ret, err) {
				hideWaiting();
				if (ret.code = 200) {
					var data = ret.data;
					MYPAGE.questionNum = data.length;
					renderQues(data);
				} else {
					api.toast({
						msg: '错误码：' + err.code + '；错误信息：' + err.msg + '网络状态码：' + err.statusCode,
						location: 'middle',
						duration: 1000
					});
				}
			});
			api.addEventListener({
				name: 'ok'
			}, function(ret, err) {
				submitAnswer();
			});
		}
	</script>

</html>